{% extends 'component/layout.html' %}
{% block title %} 首页 {% endblock %}
{% block style %}
<link rel="stylesheet" href="node_modules/swiper/dist/css/swiper.min.css">
<link rel="stylesheet" type="text/css" href="less/index.less">
{% endblock %}
{% block body %}
<section id="swiper1" class="swiper">
    <div class="swiper-container ">
        <div class="swiper-wrapper">
            {% for item in [,,,] %}
            <div class="swiper-slide"><img src="images/focus.jpg" alt="" class="img-fluid"></div>
            {% endfor %}
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>
        <!-- 如果需要滚动条 -->
    </div>
</section>
<!--  -->
<div class="container">
    <div class="home-about-box d-lg-flex">
        <div class="home-about-img">
            <img src="images/home-about.jpg" alt="">
            <div class="caption">
                <div class="row no-gutters justify-content-between">
                    <div class="col-auto">
                        <div class="num">2016</div>
                        <div class="text">成立时间（年）</div>
                    </div>
                    <div class="col-auto">
                        <div class="num">300.0000</div>
                        <div class="text">注册资金（元）</div>
                    </div>
                    <div class="col-auto">
                        <div class="num">100+</div>
                        <div class="text">服务合作客户</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="home-m home-about">
            <div class="home-heading">
                <div class="home-title">华网卫士 公司简介</div>
                <div class="line"></div>
            </div>
            <div class="home-body">
                <p class="text"><a href="about.html">华网卫士（湖北）物联信息技术有限公司是一家从事RFID（射频识别）、VSD（视频结构化描述）、PDD（警用数字化单兵）、NB-IOT技术、RFID+E-PAPER（射频电子纸）等系统工程项目研发的公司，专注于低功耗DSP和MCU平台设计，无线通讯芯片数字信号处理并拥有多项专利。致力于低功耗RF射频，蓝牙，无线USB，非接触IC卡及RFID、NB-IOT技术等技术开发及应用......</a></p>
            </div>
        </div>
    </div>
    <!--  -->
</div>
<!--  -->
<div class="home-m home-cooperation">
    <div class="container">
        <div class="home-heading">
            <div class="home-title"><img src="images/home-cooperation-title.png" alt="" class="img-fluid"></div>
            <small>- 产 品 合 作 -</small>
        </div>
        <div class="home-body">
            <p class="text text-center">华网卫士面向社会渠道，对各类物联网应用相关的芯片丶模组丶电子消费品丶行业应用终端等硬件经销类产品进行引入合作， 欢迎提供相关资料至本页面指定邮箱</p>
            <div class="cooperation-list">
                <div class="cooperation-list-item"><a href="cooperation.html">物联网无线通信组网芯片</a></div>
                <div class="cooperation-list-item"><a href="cooperation.html">NB-loT硬件</a></div>
                <div class="cooperation-list-item"><a href="cooperation.html">物联网产品</a></div>
                <div class="cooperation-list-item"><a href="cooperation.html">低功耗蓝牙芯片</a></div>
                <div class="cooperation-list-item"><a href="cooperation.html">集成多功能模块芯片</a></div>
                <div class="cooperation-list-item"><a href="cooperation.html">电动自行车VCU</a></div>
                <div class="cooperation-list-item"><a href="cooperation.html">AI相关技术</a></div>
            </div>
        </div>
    </div>
</div>
<!--  -->
<div class="home-m home-module">
    <div class="container">
        <div class="home-heading">
            <div class="home-title"><img src="images/home-module-title.png" alt="" class="img-fluid"></div>
            <small>- 芯 片 模 组 -</small>
        </div>
        <div class="home-body">
            <section class="swiper2">
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        {% for item in Array(5) -%}
                        <div class="swiper-slide">
                            <div class="home-module-item">
                                <a href="#"><div class="img">
                                        <img src="images/home-module-img1.jpg" alt="">
                                    </div>
                                    <div class="text">APPS/NESP 芯片模组</div></a>
                            </div>
                        </div>
                        {% endfor %}
                    </div>
                </div>
                <!-- 添加箭头 -->
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </section>
            <a href="#" class="more">查看更多+</a>
        </div>
    </div>
</div>
<!--  -->
<div class="home-m home-hardware">
    <div class="container">
        <div class="home-heading">
            <div class="home-title"><img src="images/home-hardware-title.png" alt="" class="img-fluid"></div>
            <small>- 智 能 硬 件 -</small>
        </div>
        <div class="home-body">
            <div class="d-md-flex  ">
                <div class="flex-item">
                    <div class="flex-item">
                        <a href="#"><img class="img-fluid" src="images/home-hardware-item-bg1.jpg"></a>
                    </div>
                    <div class="flex-item">
                        <a href="#"><img class="img-fluid" src="images/home-hardware-item-bg3.jpg"></a>
                    </div>
                </div>
                <div class="flex-item"><a href="#"><img class="img-fluid" src="images/home-hardware-item-bg2.jpg"></a></div>
            </div>
        </div>
    </div>
</div>
<!--  -->
<div class="home-m home-programme">
    <div class="container">
        <div class="home-heading">
            <ul class="nav">
                <li class="nav-item">
                    <a class="nav-link active" data-toggle="tab" href="#programme1">解决方案</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#programme2">案例库</a>
                </li>
            </ul>
            <small>致力于为客户打造个性化的行业解决方案，已经在多个行业领域成功应用并积累了丰富的经验。</small>
        </div>
        <div class="home-body">
            <div class="tab-content">
                <div class="tab-pane fade show active" id="programme1">
                    <div class="row">
                        {% for item in Array(3) -%}
                        <div class="col-md mb-4">
                            <div class="card">
                                <img class="card-img-top" src="images/home-case-img{{loop.index}}.jpg">
                                <div class="card-body">
                                    <h4 class="card-title">行业终端</h4>
                                    <p class="card-text">致力于为客户打造个性化的行业解决方案，已经在多个行业领域成功应用并积累了丰富的经验。</p>
                                </div>
                            </div>
                        </div>
                        {% endfor %}
                    </div>
                </div>
                <div class="tab-pane fade" id="programme2">
                    <div class="row">
                        {% for item in Array(3) -%}
                        <div class="col-md mb-4">
                            <div class="card">
                                <img class="card-img-top" src="images/home-case-img{{loop.index}}.jpg">
                                <div class="card-body">
                                    <h4 class="card-title">行业终端</h4>
                                    <p class="card-text">致力于为客户打造个性化的行业解决方案，已经在多个行业领域成功应用并积累了丰富的经验。</p>
                                </div>
                            </div>
                        </div>
                        {% endfor %}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--  -->
<div class="home-m home-news">
    <div class="container">
        <div class="home-heading">
            <div class="home-title">新闻资讯</div>
            <a href="#" class="more">查看更多+</a>
        </div>
        <div class="home-body">
            <div class="row">
                <div class="col-lg">
                    <div class="newsImg  mb-4">
                        <a href="#"><img class="img-fluid" src="images/home-news-img1.jpg">
                            <div class="text-block">
                                <div class="text-title">物联网联盟智慧城市创新应用论坛在京召开ONENET</div>
                                <div class="text-date">行业新闻 | 2019/07/31</div>
                            </div></a>
                    </div>
                </div>
                <div class="col-lg">
                    <ul class="list">
                    {% for item in Array(3) -%}
                        <li><a href="#">护航5G，梆梆安全亮相中国移动全球合作伙伴大会应用论坛在京召开ONENET</a>
                            <div class="date">行业新闻 | 2019/07/31</div>
                        </li>
                    {% endfor %}
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<!--  -->
<div class="home-m home-partner">
    <div class="container">
        <div class="home-heading">
            <small>- 合 作 伙 伴 -</small>
        </div>
        <div class="home-body">
            <div class="row justify-content-center">
                {% for item in Array(10) -%}
                <div class="col-6 col-sm-auto mb-4"><a href="javascript:;"><img class="img-fluid" src="images/home-partner-img{{loop.index}}.png" alt=""></a></div>
                {% endfor %}
            </div>
        </div>
    </div>
</div>
<!--  -->
{% endblock %}
{% block script %}
<script type="text/javascript" src="node_modules/swiper/dist/js/swiper.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
{% endblock %}